<template>
  <div class="index">
    <div v-for="(item,index) in new Array(5)" :key="index">
      <div class="home" style="width:100%;">
        <VideoPlayer
          :id="'player'+index"
          :videoId="'player'+index"
          :startSecond="startSecond"
          :interval="interval"
          :videoPath="videoPath"
          :screenScale="screenScale"
          @recordingTime="recordingTime"
          :posterPath="posterPath"
        ></VideoPlayer>
      </div>
    </div>
  </div>
</template>

<script>
import VideoPlayer from '../components/videoPlayer'

export default {
  name: 'home',
  components: {
    VideoPlayer
  },
  data(){
    return {
      startSecond:0,
      interval:0,
      videoPath:'',
      screenScale: '16/9',
      posterPath: '',
      posterPath:'http://vjs.zencdn.net/v/oceans.png',
    }
  },
  mounted(){
    setTimeout(() => {
      this.startSecond = 10
      this.interval = 3
      this.videoPath = 'http://vjs.zencdn.net/v/oceans.mp4'
    },2000)
  },
  methods:{
    recordingTime(sec,videoId){
      console.log('记录时间',sec,videoId)
    }
  }
}
</script>
